element的table表格组件有一个max-height属性，可以设置table的最大高度，但是当我设置这个属性的值为百分比或者响应式的时候，却没有生效，如下所示。

这是因为element-ui的文档，max-height的合法的值为数字或者单位为 px 的高度。无法识别响应式的css。

首先列举出代码： 首先设置table组件的ref属性，以及设置max-height的值。

该方案只适用于element-ui2.72及以下的版本，2.80及以上ma-height属性不支持百分百，只支持px和数值，但第一种方法仍然有效。

PS：这两种写法并不能设置表格的最大高度随着屏幕大小动态变化，只是实现了表格内容的最大高度，可以保证分页组件一直挨着表格内容下方。如果想动态设置，下面方法会有介绍

${document.documentElement.clientHeight} 可以获取到屏幕的高度，然后减去一个固定值就可以保证表格高度自适应了。

mounted加载函数中，如果页面宽高变化，则需要重新获取屏幕的高度值。此时需要用到的是window的一个监听尺寸变化的函数，就是 onresize函数。

第三种方案也有一定的问题，如果打开控制台，这样屏幕高度就会变化，但table的高度并没有实时的刷新变化。其实这个问题也好解决，只需要对屏幕的高度使用watch监听，当屏幕高度变化时，重新调用函数即可，这里不多写了。